<!-- 医院介绍 -->
<template>
    <view class="index-page">
        <view class="topbackground">
            <view class="header" :style="{ paddingTop: heightConfig.navBarPaddingTop + 'px' }">
                <view class="Narbar_bo">
                    <view @click="back"><u-icon name="arrow-left"></u-icon></view>
                    <!-- <view></view> -->
                    <view class="title" size="19px">医院介绍</view>
                    <view></view>
                </view>

                <view class="backImag">
                    <!-- <image src="/static/images2/健康百科.png" mode=""></image> -->
					<!-- <image  v-if="info.url" :src="baseImgUrl + info.url" class="img"></image> -->
					<swiper :indicator-dots="true" :autoplay="true" circular :interval="3000" :duration="1000" indicator-color="#DAEFFF;">
					    <swiper-item v-for="(item,index) in info.url" :key="index">
					        <view class="swiper-item" style="margin: 20rpx;" >
					            <image :src="baseImgUrl+item" mode="" style="width: 686rpx; height: 270rpx;"></image>
					        </view>
					    </swiper-item>
					    
					</swiper>
                </view>
                <view class="topInfo">
                    <view class="border" style="margin-top: 8rpx;">

                    </view>
                    <view class="hosLev" style="margin-left: 10rpx;">
                        医院等级
                    </view>
                    <view class="border" style="margin-left: 410rpx;margin-top: 8rpx;">

                    </view>
                    <view class="hosPho" style="margin-left: 10rpx;">
                        医院电话
                    </view>
                </view>
                <view class="topInfo1" style="margin-top: 12rpx;">
                    <view  >
                        {{info.hospitalLevel}}
                    </view>
                    <view style="margin-right: 48rpx;">
                           {{info.phone}}
                    </view>
                </view>
                <view class="topInfo">
                    <view class="border" style="margin-top: 8rpx;">

                    </view>
                    <view class="hosLev" style="margin-left: 10rpx;">
                        地址：{{info.address}}
                    </view>
                    
                </view>
                <view class="topInfo">
                    <view class="border" style="margin-top: 8rpx;">
                
                    </view>
                    <view class="hosLev" style="margin-left: 10rpx;">
                        简介
                    </view>
                    
                </view>
                <view class="content" v-html="info.introduction">
					
                </view>
            </view>
        </view>
    </view>
    </view>
</template>

<script>
    import loginApi from "@/api/login";
	import { baseImgUrl } from "@/config";
	import mine from "@/api/mine" 
    import {
        getToken
    } from "@/utils/auth";
    import {
        getQueryString
    } from "@/utils/index";
	//import api from "@/api/protocol";
    export default {
        name: "Index",
        components: {},
        data() {
            return {
				baseImgUrl,
                list3: [
                    'https://cdn.uviewui.com/uview/swiper/swiper3.png',
                    'https://cdn.uviewui.com/uview/swiper/swiper2.png',
                    'https://cdn.uviewui.com/uview/swiper/swiper1.png',
                ],
                codeUserId: null, // 上级id
                heightConfig: {},
                keyword: "",
                swiperList: [], // 轮播
                profileList: [], // 简介
                referralsList: [],
                ductionData:{},
                transitionShow: true,
                transitionMode: "slide-right",
                iconShow: true,
                iconMode: "slide-up",
				info:{
					phone:'',
					hospitalLevel:'',
					address:'',
					introduction:'',
				}
            };
        },
        onLoad(query) {
            this.mainHeight = this.$store.getters.heightData.noTabMainHeight;
            this.heightConfig = this.$store.getters.heightData;

        },
        onShow() {
		this.getContentList()
        },
        onReady() {},
		mounted(){
		},
        methods: {
		    // 推荐
		    getContentList() {
		        mine.gethosDyction({}).then((res) => {
		            if (res.code == 200) {
						 
						 console.log(res,"图片测试")
						 if (res.rows?.length) {
						 	this.info = res.rows[0]
							this.info.url = this.info.url.split(',')
						
						 }
		
		            }
		        });
		    },
			back(){
				 uni.navigateBack({
				 delta: 1 // 返回层数，1表示上一页面
				 });
			}
        },
    };
</script>

<style lang="less" scoped>
    * {
        margin: 0;
        padding: 0;
        background: #F7F8FA;
    }

    .topbackground {
        width: 100%;
        height: 344rpx;
        // background: url("/static/images2/首页顶部背景图.png") no-repeat;
        // background-size: 100% 100%;
    }

    .index-page {

        width: 750rpx;
        height: 100vh;
		
        background: #F7F8FA;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        flex-direction: column;
        // background-color: #fff;

        .header {
            width: 100%;
            // padding: 0 20rpx;
			height: 100vh;
            // background-color: #fff;
			overflow: hidden;
			overflow-y: scroll;

            .logo {
                width: 200rpx;
                height: 60rpx;
                // background-color: #fee7eb;
                border-radius: 20px;
                text-align: center;
                line-height: 60rpx;
                margin: 0 auto;
            }

            .search {
                width: 670rpx;
                height: 72rpx;
                background: #FFFFFF;
                border-radius: 34rpx 34rpx 34rpx 34rpx;
                // padding: 20rpx 0;
                margin-left: 40rpx;
                margin-top: 10rpx;
                display: flex;
                justify-content: center;
                align-items: center;
            }
        }

        .Narbar_bo {
            width: 100%;
            height: 35px;
            display: flex;
            padding: 0 28rpx;
            justify-content: space-between;
            align-items: center;

            .title {
                font-size: 18px;
                font-weight: 600;
            }
        }
    }

    .backImag {
        margin: 40rpx 0 0 32rpx;
        width: 686rpx;
        height: 306rpx;
        // background: #FFFFFF;
        border-radius: 16rpx 16rpx 16rpx 16rpx;
        overflow:hidden;
        image {
            overflow:hidden;
            height: 100%;
            width: 100%;
            object-fit: cover;
        }
    }
  .content{
	 
	  padding: 40rpx;
	   overflow-wrap: break-word;
  }
    .topInfo {
        width: 686rpx;
        margin: 30rpx 0 0 32rpx;
        display: flex;
	
        // justify-content: left;
        // align-items: center;
        font-weight: 500;
        font-size: 26rpx;
        color: #333333;
	   
    }
.topInfo1{
	display: flex;
	justify-content: space-between;
	font-weight: 500;
	font-size: 26rpx;
	color: #333333;
	padding:0 30rpx;
}
    .border {
        // margin-top: 10rpx;
        width: 8rpx;
        height: 24rpx;
        background: #159DFF;
        border-radius: 28rpx 28rpx 28rpx 28rpx;
    }
</style>